import Vue from "vue";
import Vuex from "vuex";
import getters from "./getters";

Vue.use(Vuex);

// https://webpack.js.org/guides/dependency-management/#requirecontext
const modulesFiles = require.context("./modules", true, /\.js$/);

// you do not need `import app from './modules/app'`
// it will auto require all vuex module from modules file
const modules = modulesFiles.keys().reduce((modules, modulePath) => {
  // set './app.js' => 'app'
  const moduleName = modulePath.replace(/^\.\/(.*)\.\w+$/, "$1");
  const value = modulesFiles(modulePath);
  modules[moduleName] = value.default;
  return modules;
}, {});

const store = new Vuex.Store({
  modules,
  getters,
  state: {
    classify: [],
  },
  mutations: {
    defaultKeys(state, arr) {
      state.classify = arr;
    },
    addKeys(state, key) {
      state.classify.push(key.id);
      console.log("vuex", state.classify);
    },
    delKeys(state, key) {
      const arr = state.classify;
      arr.forEach((item, index) => {
        if (key.id == item) {
          arr.splice(index, 1);
        }
      });
      state.classify = arr;
      console.log("delvuex", state.classify);
    },
    newArr(state, arr) {
      state.classify = arr;
      console.log("newvuex", state.classify);
    },
  },
}); 

export default store;
